import { useState } from 'react'
import './App.css'
import { connect } from 'react-redux'
import { doLoginAction, doAsyncLoginAction } from './store/actions/login'
function App(props) {
  const { login, doLogin, doAsyncLogin } = props
  return (
    <div className="App">
      {!login && <div>未登录 <button onClick={doLogin}>登录</button>
      <button onClick={doAsyncLogin}>异步登录</button>
      </div>} 
      {login && <div>已登录</div>} 
    </div>
  )
}
const mapStateToProps = (state) => ({
  login: state.login.login
})
const mapDispatchToProps = (dispatch) => ({
  doLogin() {
    dispatch(doLoginAction())
  },
  doAsyncLogin() {
    dispatch(doAsyncLoginAction())
  }
})
export default connect(mapStateToProps, mapDispatchToProps)(App)
